import React, { Component } from 'react';
import { View, ScrollView } from 'react-native';
import styles from './styles';

import TabItem from './TabItem';

class ListTab extends Component{
  render() {

    const { fieldData, onTabClick, curIdx } = this.props;

    return (
      <View
        style={styles.tabContainer}
      >
        {/* showsHorizontalScrollIndicator 不显示横向滚动条 */}
        <ScrollView
          showsHorizontalScrollIndicator={false}
          horizontal={true}
        >
          {fieldData.map((item, index) => {
            return (
              <TabItem
                data={item}
                onTabClick={onTabClick}
                curIdx={curIdx}
                index={index}
                key={index}
                styles={styles}
              />
            );
          })}
        </ScrollView>
      </View>
    );
  }
}

export default ListTab;